<template>
  <div>
    <div class="seven">
      <!-- 1 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-dingdan"></span>
          <p class="dingdan">道具订单</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 2 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-xiaoxiong"></span>
          <p class="dingdan">周边订单</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 3 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-youhuiquan1"></span>
          <p class="dingdan">我的优惠券</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 4 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-icon"></span>
          <p class="dingdan">心愿单</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 5 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-lingquguanggao
"></span>
          <p class="dingdan">领取中心</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 6 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-zhanghulingqu"></span>
          <p class="dingdan">周边领取中心</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
      <!-- 7 -->
      <div class="seven1">
        <div class="zuo">
          <span id="doudou" class="iconfont icon-dingdan"></span>
          <p class="dingdan">我的动态</p>
        </div>
        <div class="you">
          <span class="iconfont icon-youjiantou1"></span>
        </div>
      </div>
    </div>
    <!-- 吐槽 -->
    <div class="tucao">
      <img src="45.jpg" alt="" />
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.seven {
  width: 100%;
  height: 3.5rem;
  /* background: blueviolet; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.seven1 {
  width: 100%;
  height: 0.5rem;
  /* background-color: burlywood; */
  display: block;
  display: flex;
  justify-content: space-between;
}
.zuo {
  display: inline;
  width: 55%;
  height: 00.5rem;
  /* background-color: rgb(29, 193, 199); */
}
.dingdan {
  display: inline;
  font-size: 0.16rem;
  margin-left: 0.1rem;
}
#doudou {
  font-size: 0.2rem;
  text-align: center;
  line-height: 00.5rem;
}
.you {
  display: inline;
  width: 40%;
  height: 00.5rem;
  padding-left: 1.3rem;
  line-height: 00.5rem;
  font-size: 0.2rem;
}
.tucao {
  width: 100%;
  height: 1rem;
  margin-bottom: 00.2rem;
}
.tucao img {
  width: 100%;
  height: 100%;
}
</style>